<template>
  <div>
    <Box>
      <div slot="box" style="display: flex;justify-content: space-between;">
        <div>
          <h2 v-if="this.Midata.caseName">{{ this.Midata.caseName }}</h2>
          <h2 v-if="this.Midata.name">{{ this.Midata.name }}</h2>
          <h2 v-if="this.Midata.eventName">{{ this.Midata.eventName }}</h2>
          <div>
            <div>
              <span v-if="this.Midata.code && this.item !== 'Zh'">
                <span>案件编号：{{ this.Midata.code }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.caseCode && this.item !== 'Zh'">
                <span>案件编号：{{ this.Midata.caseCode }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.eventType	&& this.item !== 'Zh'">
                <span>案(事)件类型：{{ this.filterMultiDictText('cases_level',this.Midata.eventType	 )}}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.mainTypes	&& this.item === 'Ma'">
                <span>案(事)件类型：{{this.Midata.mainTypes}}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.occurrenceDate ">
                <span>案件发生开始时间：{{ this.Midata.occurrenceDate }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.placeOccurrence">
                <span>发生地：{{ this.Midata.placeOccurrence }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.occurrencePlace">
                <span>发生地：{{ this.Midata.occurrencePlace }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.detailedAddress">
                <span>发生地详址：{{ this.Midata.detailedAddress }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.detailedAddressOccurrence">
                <span>发生地详址：{{ this.Midata.detailedAddressOccurrence }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.nature">
                <br>
                <span>案(事)件性质：{{ this.filterMultiDictText('cases_nature',this.Midata.nature) }}</span>
<!--                <span>案(事)件性质：{{ this.Midata.nature }}</span>-->
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.eventScale">
                <span>事件规模：{{ this.filterMultiDictText('event_scale',this.Midata.eventScale) }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.eventCategory">
                <br>
                <span>事件类别：{{ this.filterMultiDictText('event_category',this.Midata.eventCategory) }}</span>
              </span>
              <span v-if="this.Midata.peopleInvolvedNumber">
                <span>涉及人数：{{ this.Midata.peopleInvolvedNumber }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.unitsInvolved">
                <span>涉及单位：{{ this.Midata.unitsInvolved }}</span>
                &emsp;&emsp;&emsp;

              </span>

              <span v-if="this.Midata.terminationDate">
                <br>
                <span >侦查终结日期：{{ this.Midata.terminationDate }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.eventLevel">
                <br>
                <span>事件分级：{{ this.filterMultiDictText('cases_level',this.Midata.eventLevel) }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.mainTypes && this.item !== 'Ma'">
                <span>事件类型：{{ this.Midata.mainTypes }}</span>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.longitude && this.item !== 'Zh'">
                <span>经纬度：</span>
                <span id="sj">{{ this.Midata.longitude }} , {{ this.Midata.latitude }}</span>
                <a href="javascript:;" @click="doCopy">复制</a>
                &emsp;&emsp;&emsp;
              </span>
              <span v-if="this.Midata.createBy && this.item === 'Ma'">
                <span>负责人：{{ this.Midata.createBy }}</span>

              </span>
            </div>
          </div>
        </div>
        <div style="display: flex;align-items: center;" v-if="!situation">
          <div><span>状态:</span><span :style="this.Midata.state == '已完结' ? 'color: #888888;' : 'color: blue;' ">{{ this.Midata.state }}</span></div>
          <div v-if="this.Midata.state != '已完结' && userIdentity" style="margin-left: 15px"><j-select-user-by-dep :multi="true" :eventId="id" :eventType="type"></j-select-user-by-dep></div>
          <div v-if="this.Midata.state != '已完结'" style="margin-left: 15px"><a-button @click="qidong">启动预案</a-button></div>
          <div v-if="this.Midata.state != '已完结'" style="margin-left: 15px"><a-button type="primary" @click="jieshu">任务结束</a-button></div>
        </div>
        <div style="display: flex;align-items: center;" v-if="situation == 'ME'">
          <div><span>状态:</span><span :style="this.Midata.state == '已完结' ? 'color: #888888;' : 'color: blue;' ">{{ this.Midata.state }}</span></div>
          <div style="margin-left: 15px" v-if="processStatus == '1'" @click="chexiao"><a-button>撤销任务</a-button></div>
        </div>
        <div style="display: flex;align-items: center;" v-if="situation == 'TE'">
          <div><span>状态:</span><span :style="this.Midata.state == '已完结' ? 'color: #888888;' : 'color: blue;' ">{{ this.Midata.state }}</span></div>
          <div v-if="this.Midata.state != '已完结'" style="margin-left: 15px" @click="shenpi(3)"><a-button>驳回</a-button></div>
          <div v-if="this.Midata.state != '已完结'" style="margin-left: 15px" @click="shenpi(2)"><a-button>通过</a-button></div>
        </div>
      </div>
    </Box>
    <div>
      <a-modal v-model="visible1" title="启动预案" @ok="handleOk1" width="600px" centered>
        <a-select v-model="querys" style="width: 100%" @change="handleChange1" placeholder="请选择">
          <a-select-option v-for="(item,index) of this.lis" :value="item.id" :key="index" >
            {{ item.name }}
          </a-select-option>
        </a-select>
      </a-modal>
    </div>
    <div>
      <a-modal v-model="visible" title="审批意见" @ok="handleOk" width="600px" centered>
        <a-form-model
          ref="ruleForm"
          :model="form"
          :rules="rules"
        >
          <a-form-model-item label="审批意见" prop="eventOverview">
            <a-input v-model="form.eventOverview" type="textarea" />

          </a-form-model-item>
        </a-form-model>
      </a-modal>
    </div>
    <div>
      <a-modal v-model="visible2" title="案事件总结" @ok="handleOk2" width="600px" centered>

        <a-form-model
          ref="ruleForm"
          :model="form"
          :rules="rules"
        >
          <a-form-model-item label="案事件总结" prop="input">
            <a-textarea
              v-model="form.input"
              placeholder="案事件总结"
              :auto-size="{ minRows: 3, maxRows: 5 }"
            />
          </a-form-model-item>
        </a-form-model>
      </a-modal>
    </div>
    <div class="planse">
      <j-modal
        :width="modalWidth"
        :visible="visible3"
        :title="title"
        switchFullscreen
        wrapClassName="j-user-select-modal"
        @ok="handleSubmit"
        @cancel="close"
        style="top:50px"
        footer=""
      >
        <plans ref="planee" v-if="this.visible3" :ide="planse" @planss="xaingxi"/>
        <div style="display: flex;justify-content: center">
          <a-button @click="textList">编辑</a-button>
          <a-button type="primary" style="margin-left: 15px" @click="qiyong">直接启用</a-button>
        </div>
      </j-modal>
    </div>
  </div>

</template>

<script>
import Box from '@/views/xlgc/Box/index'
import { getDictItemsFromCache } from '@api/api'
import { putCancel, putChongfa, putTurnRound } from '@api/xlgc/staging'
import JSelectUserByDep from './JSelectUserByDep'
import {getManageListAll, getTypeLints, postQidong} from "@api/xlgc/plan";
import plans from '@/views/xlgc/plan/manage/details'
import {endTask, endTask1, endTask2, endTask3, endTask4} from "@api/xlgc/lawCase";
import Vue from "vue";
import {USER_INFO} from "@/store/mutation-types";
export default {
  name: 'Regulate',
  components: { Box, JSelectUserByDep,plans },
  props: {
    Midata: Object,
    situation: String,
    processStatus: String,
    caozuo: Object,

    type:String,
    id:String,
    item:String,
    yaTitle:String
  },
  mounted() {
    let user = Vue.ls.get(USER_INFO)
    console.log(user)
    this.userIdentity = user.userIdentity === 2
    // console.log(this.caozuo)
    // console.log(this.midata)
    console.log(this.situation)
    console.log(this.processStatus)
    this.refreshTable1()
    if(this.yaTitle !== undefined){
      this.visible1 = true
      // this.querys = this.yaTitle
      // this.handleOk1()
    }
  },
  data() {
    return {
      userIdentity:false,
      planse: undefined,
      title:'预案详情',
      modalWidth: 1400,
      lis:[],
      querys: undefined,
      input: '',
      visible: false,
      visible1: false,
      visible2: false,
      visible3:false,
      form: {
        eventOverview: '',
        input:undefined
      },
      rules: {
        eventOverview: [
          { required: true, message: '该项不能为空', trigger: 'blur' },
          { min: 5, message: '请输入至少五个字符', trigger: 'blur' }
        ],
        input:[{ required: true, message: '该项不能为空', trigger: 'blur' },
          { min: 5, message: '请输入至少五个字符', trigger: 'blur' }]
      },
      sta: {},
      val: {},
      pass: undefined,
      planseID: undefined
    }
  },
  methods: {
    qiyong(){
      this.$refs.planee.transmit()
    },
    xaingxi(val){
      console.log(val)
      let data = {
        eventId:this.id,
        eventType:this.type,
        plan:{
          planUsers:this.planUsers,
          reservePlan:{
            measures:val.measures,
            name:val.name,
            planCategory:val.planCategory,
            technologicalProcess:val.technologicalProcess
          }
        },
        planId:this.querys
      }
      postQidong(data).then(ser => {
        if(ser.success){
          this.$message.success(ser.message, 2,);
          // this.routeree()
          this.$router.go(0)
        } else {
          this.$message.error(ser.message,2);
        }
        console.log(ser)
      }).catch(err => {
        this.$message.error('出现意料之外的错误，请联系开发人员');
      })
    },
    routeree(){
      this.$router.push({
        path:'/LifeCase/detailed',
        query:{
          itemId:this.type,
          item:this.item,
          id:this.id
        }
      })
    },
    textList(val) {
      console.log(val)
      this.$router.push({
        path: '/manage/addList',
        query: {
          eventId:this.$route.query.title,
          type:this.type,
          item: true,
          id: this.planse,
          tortuous:'tortuous'
        }
      })
    },
    close() {
      this.visible3 = false
    },
    handleSubmit(){
      // that.$emit('ok', undefined)
    },
    refreshTable1() {
      getManageListAll()
        .then(res => {
          console.log(res)
          this.lis = res.result
        })
        .catch(e => {
          this.$message.warn('请求失败！')
        })
    },
    handleChange1(val) {
      console.log(val)
      return val
    },
    doCopy: function(val) {
      let thls = this
      let text = document.querySelector('#sj').innerHTML
      this.$copyText(text).then(
        function(e) {
          thls.$message.success('复制成功', 2)
          console.log(e)
        },
        function(e) {
          console.log(e)
        }
      )
    },
    shenpi(sta) {
      this.visible = true
      this.sta = sta
      this.val = this.caozuo
      console.log(this.caozuo)
    },
    submitForm() {
      this.$refs.ruleForm.validate(valid => {
        console.log(valid)
        this.pass = valid
        return valid
      })
    },
    handleOk() {
      this.submitForm()
      if (!this.pass) {
        this.$message.error('请正确填写审批意见')
      } else {
        this.turnRound(this.val)
        this.visible = false
        this.val = ''
      }
    },
    qidong(){
      this.visible1 = true
    },
    handleOk1(){
      console.log(this.querys)
      this.visible1 = false
      this.planse = this.querys
      this.visible3 = true
    },
    handleOk2(){
      this.submitForm()
      if (this.pass) {
        if(this.item === 'Mi'){
          endTask({eventId:Number(this.id)+1-1,eventSummary:this.form.input}).then(ser => {
            console.log(ser)
            if(ser.success){
              this.$message.success('提交成功', 2)
              this.$router.push({
                path:'/LifeCase/list'
              })
            }else{
              this.$message.error('提交失败，请联系开发人员')
            }
          }).catch(err => {
            this.$message.error('提交失败，请联系开发人员1')
          })
        }
        if(this.item === 'Ma'){
          endTask1({eventId:Number(this.id)+1-1,eventSummary:this.form.input}).then(ser => {
            console.log(ser)
            if(ser.success){
              this.$message.success('提交成功', 2)
              this.$router.push({
                path:'/contradiction/list'
              })
            }else{
              this.$message.error('提交失败，请联系开发人员')
            }
          }).catch(err => {
            this.$message.error('提交失败，请联系开发人员1')
          })
        }
        if(this.item === 'Xi'){
          endTask2({eventId:Number(this.id)+1-1,eventSummary:this.form.input}).then(ser => {
            console.log(ser)
            if(ser.success){
              this.$message.success('提交成功', 2)
              this.$router.push({
                path:'/route/list'
              })
            }else{
              this.$message.error('提交失败，请联系开发人员')
            }
          }).catch(err => {
            this.$message.error('提交失败，请联系开发人员1')
          })
        }
        if(this.item === 'Te'){
          endTask3({eventId:Number(this.id)+1-1,eventSummary:this.form.input}).then(ser => {
            console.log(ser)
            if(ser.success){
              this.$message.success('提交成功', 2)
              this.$router.push({
                path:'/teachSchool/list'
              })
            }else{
              this.$message.error('提交失败，请联系开发人员')
            }
          }).catch(err => {
            this.$message.error('提交失败，请联系开发人员1')
          })
        }
        if(this.item === 'Zh'){
          endTask4({eventId:Number(this.id)+1-1,eventSummary:this.form.input}).then(ser => {
            console.log(ser)
            if(ser.success){
              this.$message.success('提交成功', 2)
              this.$router.push({
                path:'/great/great'
              })
            }else{
              this.$message.error('提交失败，请联系开发人员')
            }
          }).catch(err => {
            this.$message.error('提交失败，请联系开发人员1')
          })
        }
      }
      else {
        this.$message.error('请正确填写案事件总结')
      }

    },
    turnRound() {
      let data = {
        processId: this.caozuo.processId,
        remark: this.form.eventOverview,
        status: this.sta
      }
      console.log(data)
      putTurnRound(data)
        .then(res => {
          console.log(res)
          if (res.success) {
            this.$message.success('审批成功')
            this.$router.push({path:'/Exbacklog/list'})
          } else {
            this.$message.warning('审批失败')
          }
        })
        .catch(e => {
          this.loading = false
          this.$message.warn('请求失败！')
        })
    },
    chexiao() {
      let processType = 1
      if (this.$route.query.caozuo.processType == '案(事)件') {
        processType = 1
      }
      if (this.$route.query.caozuo.processType == '启动预案') {
        processType = 3
      }
      if (this.$route.query.caozuo.processType == '物资调用') {
        processType = 2
      }
      let data = {
        // incidentName: this.$route.query.caozuo,
        // taskId: this.caozuo.taskId,
        // type: processType
        incidentName: this.$route.query.caozuo.title,
        taskId: this.$route.query.caozuo.taskId,
        type: processType,
        taskType:this.$route.query.caozuo.taskType
      }
      console.log(data)
      putCancel(data)
        .then(res => {
          console.log(res)
          if (res.success) {
            this.$message.success('撤销成功')
            this.$router.back()
          } else {

          }
        })
        .catch(e => {
          this.loading = false
          this.$message.warn('请求失败！')
        })
    },
    chongxin(val) {
      console.log(val)
      if (val.processType == '案(事)件') {
        val.processType = 1
      }
      if (val.processType == '启动预案') {
        val.processType = 3
      }
      if (val.processType == '物资调用') {
        val.processType = 2
      }
      let data = {
        incidentName: val.title,
        taskId: val.taskId,
        type: val.processType
      }
      console.log(data)
      putChongfa(data)
        .then(res => {
          console.log(res)
          if (res.success) {
            this.$message.success('重新发起成功')
            this.table = res.result.records
            this.loading = false
            this.refreshTable(this.pageFilter)
          } else {
            this.loading = false
          }
        })
        .catch(e => {
          this.loading = false
          this.$message.warn('请求失败！')
        })
    },
    jieshu() {
      this.visible2 = true
    },

    filterMultiDictText(dictCode, text) {
      console.log(dictCode, text)
      if (!text && text !== 0) return
      let datas = getDictItemsFromCache(dictCode)
      // return this.$filterMultiDictText(datas, text)
      return this.$filterDictText(datas, text)
    }
  }
}
</script>

<style scoped>
/*/deep/ .ant-modal-footer{*/
/*  display: none;*/
/*}*/


</style>
